<script setup>

</script>
<template>
    <div class="wrapper">
        <div class="endText">
            <h1>Juan-DIY-H5</h1>
            <img src="/images/logo.png" style="height: 80px;">
            <h2>核心文件结构</h2>
            <blockquote>
                <p><b style="color: blue">/src/pages/diymobile/</b><br>
                    @name: 通用DIY模板<br>
                    @Author: flashme.cn<br>
                    @Date: 2024-09-23<br>
                    @description:<br>
                    ├─ /组件目录/<br>
                    │ ├ index.vue （组件配置入口文件）<br>
                    │ ├ config.js （组件数据结构）<br>
                    │ └ module.vue （组件模块 呈现文件 - 可自己定制）<br>
                    ├─ config.js （按钮配置）<br>
                    ├─ select.vue （定义可选链接类型 - 可自己定制）<br>
                    ├─ <b>index.vue</b> （后台入口文件）<br>
                    ├─ mobile.vue （可拖拽组件模块 - 配置组件）<br>
                    ├─ module.vue （组件模块 - 项目引用呈现文件）<br>
                    ├─ <b>view.vue</b> （前端项目引用示例）<br>
                    ├─ link.js （组件链接出口 - 可自己定制）<br>
                    └─ unit.js （单位 - 默认px rem示例1rem=20px）</p>
            </blockquote>
            <h3>其它被引入的文件</h3>
            <blockquote>
                <p>/src/js/store.js（全局状态）<br>
                    /src/js/function.js（函数类）<br>
                    /src/components/mode-upimg.vue（上传组件）<br>
                    /src/components/material.vue（在线文件选择器 - 演示文件 如不需要store.js的online:false）<br>
                    /src/assets/style.css（全局样式）<br>
                    /public/css/styleme.css（静态公共样式，可能会与已有项目样式冲突）</p>
            </blockquote>
            <h3>前端预览DEMO</h3>
            <blockquote>/src/views/diy/diyview.vue</blockquote>
        </div>
    </div>
</template>
<style scoped>
.wrapper{background-color: #f2f2f2;}
blockquote{background-color:#fff7ee;border-left: cadetblue 5px solid;padding: 5px 10px;}
</style>